<template>
    <div id="id">
        <span class="id_span">归档</span>
        <ul class="id_ul">
            <li v-for="(val,index) in TableInfo" :key="index">{{val.dateTime}} ({{val.count}})
                <ul class="id_ul_ul">
                    <li v-for="(val,index) in tableLi" :key="index"><nuxt-link :to="{name:'details-id',params:{id:124}}">{{val}}</nuxt-link></li>
                </ul>
            </li>
        </ul>
    </div>
</template>
<script>
export default {
    data() {
        return {
            TableInfo: [
                {
                    dateTime: "2018年7月7日",
                    count: 2
                },
                {
                    dateTime: "2018年7月8日",
                    count: 3
                }
            ],
            tableLi:[
                '我的测试信息'
            ]
        };
    },
};
</script>
<style scoped lang="scss">
#id {
    margin-left: 250px;
    padding-left: 35px;
    padding-right: 85px;
    margin-top: 35px;
    .id_span {
        font-size: 30px;
    }
    .id_ul {
        margin: 0px;
        padding: 0px;
        font-size: 17px;
        font-weight: bold;
        > li {
            list-style: none;
            margin-top: 30px;
            .id_ul_ul {
                font-weight: 300;
                margin-top: 20px;
                > li {
                    margin-bottom: 10px;
                    cursor: pointer;
                    >a{
                        color: #2479cc;
                        text-decoration: none;
                    }
                }
            }
        }
    }
}
</style>
